<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=1">
	<title>CollectWord</title>
	<link rel="stylesheet" type="text/css" href="css/index.css">
	<link rel="stylesheet" type="text/css" href="css/tabris.css">
	<link rel="stylesheet" type="text/css" href="css/logo.css">
	<link rel="stylesheet" type="text/css" href="css/button.css">
	<link rel="stylesheet" type="text/css" href="css/sector.css">
	<link rel="stylesheet" type="text/css" href="css/getprizeSector.css">
	<link rel="stylesheet" type="text/css" href="css/surround.css">
	<link rel="stylesheet" type="text/css" href="css/line.css">
	<style>
		.rules{
			position: absolute;
			z-index: 9909;
			width: 300px;
			height: 300px;
			left: 50%;
			top: 20%;
			margin-left: -150px;
			padding: 10px;
			color: #fff;
			background: #395ecd;
			text-align: left;
			border-radius: 15px;
			display: none;
		}
		.rules{
			font-size: 16px;
			line-height: 26px;
		}
		#myrule{
				left: 50%;
				margin-left: -50px;
			
		}
	</style>
</head>
<body>
<div class="rules">
		<p>活动时间：2017.9.1-2017.9.15</p>
		<p>1.活动规则：支付金额满49元快速达的用户可随机获得一个字。
		集齐京客隆三个字可获得礼券，礼券下单快速达满39元使用。</p>
		<p>2.每人每期只可兑换一次礼券。</p>
		<p>奖项设置:10元快速达专享券（满39元使用）</p>
		<div class="prizeWrap" id="myrule">
			<div class="bb"><p>关闭</p></div>
		</div>
</div>
<div class="header">
	<div class="logo">
	<!-- Logo的动态展示 -->
		<div class="bg0 pa">
        	<div class="bg1"></div>
    	</div>
    	<div class="hx-box pa">
	        <ul class="pr">
	            <li class="hx-k1 pa0">
	                <span></span>
	            </li>
	            <li class="hx-k2 pa0">
	                <span></span>
	            </li>
	            <li class="hx-k3 pa0">
	                <span></span>
	            </li>
       	 	</ul>
    	</div>
	</div>

	<div class="prize">
	<!-- 环绕按钮 -->
		<div class="prizeWrap">
			<div class="bb"><p>活动规则</p></div>
		</div>
	</div>
</div>
<div class="container">
		<hr class="leftline">
		<hr class="middleline">
		<hr class="rightline">
	<div class="card">
		<hr class="partingLine" />
		<div class="card-top">
			<div class="card-top-left">快速达专享券</div>
			<div class="card-top-right"><a style="font-size: 28px">￥</a>10</div>
			<div class="card-top-bottom"><p>10元快速达专享券</p><p>满39可用</p></div>
		</div>
		<div class="card-bottom">
			<p>恭喜您获得10元快速达券</p>
		</div>
	</div>	
	<div class="newPrize">
		<div class="haorooms"><em></em></div>
		<div class="newPrize-circular1">
			<div class="sx1"></div>
    		<div class="sx2"></div>
		</div>
		<div class="haorooms2"><em></em></div>
		<div class="newPrize-circular2">
			<div class="sx1"></div>
    		<div class="sx2"></div>
		</div>
		<!-- <div class="newPrize-circular3">
			<div class="sx1"></div>
    		<div class="sx2"></div>
		</div> -->
		<div class="newPrize-now">
			<p>京</p>
		</div>
	</div>
	<div class="getPrize">
		<div class="getPrize-sector1">
			<div class="sx1"></div>
    		<div class="sx2"></div>
		</div>
		<div class="haorooms3"><em></em></div>
		<div id="first" class="getPrize-circular1">
			<p>京</p>
		</div>

		<div class="getPrize-sector2">
			<div class="sx1"></div>
    		<div class="sx2"></div>
		</div>
		<div class="haorooms4"><em></em></div>
		<div id="second" class="getPrize-circular2">
			<p>客</p>
		</div>

		<div class="getPrize-sector3">
			<div class="sx1"></div>
    		<div class="sx2"></div>
		</div>
		<div class="haorooms5"><em></em></div>
		<div id="third" class="getPrize-circular3">
			<p>隆</p>
		</div>
	</div>
</div>
<!-- <div class="footer">
	<div class="bb"><p>返回</p></div>
</div> -->
<script src="./js/jquery-3.1.1.min.js"></script>
<script src="./js/index.js"></script>
</body>
</html>